@keyframes fromRight {
  from {
    opacity: 0;
    transform: translateX(100%);
  }
}

@keyframes fromLeft {
  from {
    opacity: 0;
    transform: translateX(-100%);
  }
}

@keyframes fromBelow {
  from {
    opacity: 0;
    transform: translateY(100%);
  }
}

@keyframes boing {
  from {
    transform: scale(0);
    opacity: 0;
  }
}

@keyframes dialogAppear {
  from {
    background-color: transparent;
  }
}

@keyframes spinner {
  from {
    transform: rotate(0turn)
  }

  to {
    transform: rotate(1turn)
  }
}

@keyframes toggle {
  50% {
    transform: scale(0.9);
  }
}

@keyframes fadeIn {
  from {
    top: 100%;
    opacity: 0;
  }
}

@keyframes fadeOut {
  to {
    top: 100%;
    opacity: 0;
  }
}

@keyframes zoomout {
  from {
    transform: scale(2);
    opacity: 0;
  }
}

@keyframes like {
  50% {
    transform: scale(0.9);
  }
}